<template>
    <div>
        <div id="container" class="map01">
            <img src="#"/>
        </div>
        <div class="footer">
            <dl class="map02">
                <dt>
                    <h2>
                        <router-link to="/tyj/detail">建湖县体育中心</router-link>
                    </h2>
                    <h3>地址：盐城市建湖县湖中南路888号</h3>
                </dt>
                <dd>
<!--                    <a id="telTo" href="tel:0515-86299799">-->
<!--                        <img src="@/assets/sports-bureau/images/tel.png" alt="">-->
<!--                        电话-->
<!--                    </a>-->
                    <a id="go">
                        <img src="@/assets/sports-bureau/images/dh.png" alt="">
                        去这里
                    </a>
                </dd>
            </dl>

            <dl class="map02">
                <dt>
                    <h2>
                        <router-link to="/tyj/yyg">建湖县游泳馆</router-link>
                    </h2>
                    <h3>地址：盐城市建湖县湖中南路888号</h3>
                </dt>
                <dd>
<!--                    <a href="tel:0515-86299799">-->
<!--                        <img src="@/assets/sports-bureau/images/tel.png" alt="">-->
<!--                        电话-->
<!--                    </a>-->
                    <a id="go2">
                        <img src="@/assets/sports-bureau/images/dh.png" alt="">
                        去这里
                    </a>
                </dd>
            </dl>
        </div>
    </div>
</template>

<script>

    import * as $ from "@/utils/jquery.min.js";
    import "@/utils/maps.js";

    export default {
        name: "App",
        mounted() {
            const map = new AMap.Map("container", {
                zoom: 15,
                center: [119.79211, 33.448861]
            });

            const marker = new AMap.Marker({
                map: map,
                position: [119.79211, 33.448861]
            });

            marker.on("click", function () {
                marker.markOnAMAP({
                    position: map.getCurrentPosition
                });
            });

            $("#go").on("click", function () {
                marker.markOnAMAP({
                    name: "建湖县体育中心",
                    position: map.getCurrentPosition
                });
            });
            $("#go2").on("click", function () {
                marker.markOnAMAP({
                    name: "建湖县游泳馆",
                    position: map.getCurrentPosition
                });
            });
        }
    };

</script>
<style scoped>
    @import "../../assets/sports-bureau/css/base.css";
    @import "../../assets/sports-bureau/css/other.css";
</style>
